<template>
  <div class="app-container">
    <el-row :gutter="20">
      <splitpanes
        :horizontal="this.$store.getters.device === 'mobile'"
        class="default-theme"
      >
        <!--组织数据-->
        <pane size="16">
          <el-col>
            <div class="head-container">
              <el-input
                v-model="deptName"
                placeholder="请输入组织名称"
                clearable
                size="small"
                prefix-icon="el-icon-search"
                style="margin-bottom: 20px"
              />
            </div>
            <div class="head-container">
              <el-tree
                :data="deptOptionsShow"
                :props="defaultProps"
                :expand-on-click-node="false"
                :filter-node-method="filterNode"
                ref="tree"
                node-key="id"
                accordion
                :default-expanded-keys="[deptOptionsShow[0].id]"
                highlight-current
                @node-click="handleNodeClick"
              />
            </div>
          </el-col>
        </pane>
        <!--用户数据-->
        <pane size="84">
          <el-col>
            <el-form
              :model="queryParams"
              ref="queryForm"
              size="small"
              :inline="true"
              v-show="showSearch"
              label-width="68px"
            >
              <el-form-item label="环保编号" prop="code">
                <el-input
                  v-model="queryParams.code"
                  placeholder="请输入环保编号"
                  clearable
                  @keyup.enter.native="handleQuery"
                />
              </el-form-item>
              <el-form-item label="终端编号" prop="deviceNumber">
                <el-input
                  v-model="queryParams.deviceNumber"
                  placeholder="请输入终端编号"
                  clearable
                  @keyup.enter.native="handleQuery"
                />
              </el-form-item>
              <el-form-item label="SIM卡号" prop="simNumber">
                <el-input
                  v-model="queryParams.simNumber"
                  placeholder="请输入SIM卡号"
                  clearable
                  @keyup.enter.native="handleQuery"
                />
              </el-form-item>
              <el-form-item>
                <el-button
                  type="primary"
                  icon="el-icon-search"
                  size="mini"
                  @click="handleQuery"
                  >搜索</el-button
                >
                <el-button
                  icon="el-icon-refresh"
                  size="mini"
                  @click="resetQuery"
                  >重置</el-button
                >
              </el-form-item>
            </el-form>

            <el-row :gutter="10" class="mb8">
              <el-col :span="1.5">
                <el-button
                  type="primary"
                  plain
                  icon="el-icon-plus"
                  size="mini"
                  @click="handleAdd"
                  v-hasPermi="['base:config:add']"
                  >新增</el-button
                >
              </el-col>
              <el-col :span="1.5">
                <el-button
                  type="success"
                  plain
                  icon="el-icon-edit"
                  size="mini"
                  :disabled="single"
                  @click="handleUpdate"
                  v-hasPermi="['base:config:edit']"
                  >修改</el-button
                >
              </el-col>
              <el-col :span="1.5">
                <el-button
                  type="danger"
                  plain
                  icon="el-icon-delete"
                  size="mini"
                  :disabled="multiple"
                  @click="handleDelete"
                  v-hasPermi="['base:config:remove']"
                  >删除</el-button
                >
              </el-col>
              <el-col :span="1.5">
                <el-button
                  type="warning"
                  plain
                  icon="el-icon-download"
                  size="mini"
                  @click="handleExport"
                  v-hasPermi="['base:config:export']"
                  >导出</el-button
                >
              </el-col>
              <right-toolbar
                :showSearch.sync="showSearch"
                @queryTable="getList"
              ></right-toolbar>
            </el-row>

            <el-table
              v-loading="loading"
              :data="configList"
              @selection-change="handleSelectionChange"
            >
              <el-table-column type="selection" width="55" align="center" />
              <el-table-column
                label="环保编号"
                align="center"
                prop="code"
                width="100"
                :show-overflow-tooltip="true"
              />
              <el-table-column
                label="车辆分组"
                align="center"
                prop="groupNames"
                width="100"
                :show-overflow-tooltip="true"
              />
              <el-table-column
                label="终端编号"
                align="center"
                prop="deviceNumber"
                width="110"
                :show-overflow-tooltip="true"
              />
              <el-table-column
                label="SIM卡号"
                align="center"
                prop="simNumber"
                width="130"
                :show-overflow-tooltip="true"
              />
              <el-table-column label="是否在线" align="center" prop="isOnline">
                <template slot-scope="scope">
                  <dict-tag
                    :options="dict.type.car_online_status"
                    :value="scope.row.isOnline"
                  />
                </template>
              </el-table-column>
              <el-table-column
                label="上线日期"
                align="center"
                prop="onlineTime"
                width="100"
              >
                <template slot-scope="scope">
                  <span>{{
                    parseTime(scope.row.onlineTime, "{y}-{m}-{d}")
                  }}</span>
                </template>
              </el-table-column>
              <el-table-column
                label="是否停用"
                align="center"
                prop="isDisabled"
              >
                <template slot-scope="scope">
                  <dict-tag
                    :options="dict.type.car_disabled_status"
                    :value="scope.row.isDisabled"
                  />
                </template>
              </el-table-column>
              <el-table-column
                label="停用日期"
                align="center"
                prop="disabledTime"
                width="100"
              >
                <template slot-scope="scope">
                  <span>{{
                    parseTime(scope.row.disabledTime, "{y}-{m}-{d}")
                  }}</span>
                </template>
              </el-table-column>
              <el-table-column label="是否注销" align="center" prop="isCancle">
                <template slot-scope="scope">
                  <dict-tag
                    :options="dict.type.car_cancle_status"
                    :value="scope.row.isCancle"
                  />
                </template>
              </el-table-column>
              <el-table-column
                label="注销时间"
                align="center"
                prop="cancleTime"
                width="100"
              >
                <template slot-scope="scope">
                  <span>{{
                    parseTime(scope.row.cancleTime, "{y}-{m}-{d}")
                  }}</span>
                </template>
              </el-table-column>
              <el-table-column
                label="是否注册"
                align="center"
                prop="isRegister"
              >
                <template slot-scope="scope">
                  <dict-tag
                    :options="dict.type.car_register"
                    :value="scope.row.isRegister"
                  />
                </template>
              </el-table-column>
              <el-table-column
                label="注册时间"
                align="center"
                prop="registerTime"
                width="100"
              >
                <template slot-scope="scope">
                  <span>{{
                    parseTime(scope.row.registerTime, "{y}-{m}-{d}")
                  }}</span>
                </template>
              </el-table-column>
              <el-table-column label="是否告警" align="center" prop="isNotice">
                <template slot-scope="scope">
                  <dict-tag
                    :options="dict.type.car_notice"
                    :value="scope.row.isNotice"
                  />
                </template>
              </el-table-column>
              <el-table-column
                label="是否参与应急"
                align="center"
                prop="isEmergency"
                width="100"
              >
                <template slot-scope="scope">
                  <dict-tag
                    :options="dict.type.car_emergency_status"
                    :value="scope.row.isEmergency"
                  />
                </template>
              </el-table-column>
              <el-table-column
                label="操作"
                align="center"
                class-name="small-padding fixed-width"
                width="120"
              >
                <template slot-scope="scope">
                  <el-button
                    size="mini"
                    type="text"
                    icon="el-icon-edit"
                    @click="handleUpdate(scope.row)"
                    v-hasPermi="['base:config:edit']"
                    >修改</el-button
                  >
                  <el-button
                    size="mini"
                    type="text"
                    icon="el-icon-delete"
                    @click="handleDelete(scope.row)"
                    v-hasPermi="['base:config:remove']"
                    >删除</el-button
                  >
                </template>
              </el-table-column>
            </el-table>

            <pagination
              v-show="total > 0"
              :total="total"
              :page.sync="queryParams.pageNum"
              :limit.sync="queryParams.pageSize"
              @pagination="getList"
            />
          </el-col>
        </pane>
      </splitpanes>
    </el-row>

    <!-- 添加或修改车辆配置对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="130px">
        <el-form-item label="归属组织/人" prop="deptId">
          <treeselect
            v-model="form.deptId"
            :options="enabledDeptOptions"
            :disable-branch-nodes="true"
            @select="optionSelected"
            :show-count="true"
            placeholder="请选择归属组织"
          />
        </el-form-item>
        <el-form-item label="环保编号" prop="code">
          <el-select
            v-model="form.code"
            filterable
            remote
            clearable
            reserve-keyword
            @change="codeSelected"
            placeholder="请输入环保编号搜索"
            value-key="carId"
            style="width: 210px"
            :loading="codeLoading"
            :remote-method="handleCodeSearch"
            v-el-select-loadmore="handleLoadMore"
          >
            <el-option
              v-for="item in codeOptions"
              :key="item.carId"
              :label="item.code"
              :value="item"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="车辆分组" prop="groupIds">
          <el-select
            v-model="groups"
            @focus="optionGroupSelected"
            @change="handleGroupChange"
            multiple
            placeholder="请选择车辆分组"
            value-key="groupId"
          >
            <el-option
              v-for="item in groupOptions"
              :key="parseInt(item.groupId)"
              :label="item.groupName"
              :value="item.groupId"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <!--        <el-form-item label="车辆分组" prop="groupIds">-->
        <!--          <el-input-->
        <!--            type="text"-->
        <!--            v-model="groupValue"-->
        <!--            :placeholder="splicName"-->
        <!--            @keyup.enter.native="keydowm"-->
        <!--            clearable-->
        <!--            @clear="keydowm"-->
        <!--            style="width: 300px"-->
        <!--          />-->
        <!--          <el-tree-->
        <!--            :props="props"-->
        <!--            :style="{-->
        <!--              height: '100px',-->
        <!--              width: '300px',-->
        <!--              border: '1px solid #d3dce6',-->
        <!--              overflowY: 'auto',-->
        <!--            }"-->
        <!--            :load="loadGroupNode"-->
        <!--            :default-checked-keys="form.groupIds"-->
        <!--            node-key="id"-->
        <!--            ref="groupTree"-->
        <!--            lazy-->
        <!--            accordion-->
        <!--            show-checkbox-->
        <!--            @check="handleCheck"-->
        <!--          >-->
        <!--          </el-tree>-->
        <!--        </el-form-item>-->
        <el-form-item label="终端编号" prop="devicesId">
          <el-select
            v-model="form.deviceNumber"
            filterable
            remote
            clearable
            reserve-keyword
            @change="devicesIdSelected"
            placeholder="请输入终端编号搜索"
            value-key="deviceId"
            style="width: 210px"
            :loading="devicesLoading"
            :remote-method="handleDevicesSearch"
            v-el-select-loadmore="handleDevicesLoadMore"
          >
            <el-option
              v-for="item in devicesOptions"
              :key="item.deviceId"
              :label="item.number"
              :value="item"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="SIM卡号" prop="simId">
          <el-select
            v-model="form.simNumber"
            filterable
            remote
            clearable
            reserve-keyword
            @change="simIdSelected"
            placeholder="请输入终端编号搜索"
            value-key="simId"
            style="width: 210px"
            :loading="simLoading"
            :remote-method="handleSimSearch"
            v-el-select-loadmore="handleSimLoadMore"
          >
            <el-option
              v-for="item in simOptions"
              :key="item.simId"
              :label="item.number"
              :value="item"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="是否停用" prop="isDisabled">
          <el-radio-group v-model="form.isDisabled">
            <el-radio
              v-for="dict in dict.type.car_disabled_status"
              :key="dict.value"
              :label="parseInt(dict.value)"
              >{{ dict.label }}</el-radio
            >
          </el-radio-group>
        </el-form-item>
        <el-form-item label="是否注销" prop="isCancle">
          <el-radio-group v-model="form.isCancle">
            <el-radio
              v-for="dict in dict.type.car_cancle_status"
              :key="dict.value"
              :label="parseInt(dict.value)"
              >{{ dict.label }}</el-radio
            >
          </el-radio-group>
        </el-form-item>
        <el-form-item label="是否告警" prop="isNotice">
          <el-radio-group v-model="form.isNotice">
            <el-radio
              v-for="dict in dict.type.car_notice"
              :key="dict.value"
              :label="parseInt(dict.value)"
              >{{ dict.label }}</el-radio
            >
          </el-radio-group>
        </el-form-item>
        <el-form-item label="是否参与应急" prop="isEmergency">
          <el-radio-group v-model="form.isEmergency">
            <el-radio
              v-for="dict in dict.type.car_emergency_status"
              :key="dict.value"
              :label="parseInt(dict.value)"
              >{{ dict.label }}</el-radio
            >
          </el-radio-group>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  listConfig,
  getConfig,
  delConfig,
  addConfig,
  updateConfig,
  listGroupByDept,
  getGroupsByDeptId,
} from "@/api/base/config";
import { deptTreeSelectThree, listCarNoUse } from "@/api/base/car";
import { listDevice } from "@/api/base/device";
import { listSim } from "@/api/base/sim";
import { deptTreeSelect } from "@/api/system/user";
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import { Splitpanes, Pane } from "splitpanes";
import "splitpanes/dist/splitpanes.css";

export default {
  name: "Config",
  components: { Treeselect, Splitpanes, Pane },
  dicts: [
    "car_cancle_status",
    "car_disabled_status",
    "car_notice",
    "car_emergency_status",
    "car_online_status",
    "car_register",
  ],
  directives: {
    "el-select-loadmore": {
      bind(el, binding) {
        const SELECTWRAP_DOM = el.querySelector(
          ".el-select-dropdown .el-select-dropdown__wrap"
        );
        SELECTWRAP_DOM.addEventListener("scroll", function () {
          //临界值的判断滑动到底部就触发
          const condition =
            this.scrollHeight - this.scrollTop <= this.clientHeight;
          if (condition) {
            binding.value();
          }
        });
      },
    },
  },
  data() {
    return {
      // 遮罩层
      loading: true,
      codeLoading: false,
      devicesLoading: false,
      simLoading: false,
      selectObj: {
        pageNum: 1,
        pageSize: 10,
      },
      selectDevicesObj: {
        pageNum: 1,
        pageSize: 10,
        isActive: 1,
      },
      selectSimObj: {
        pageNum: 1,
        pageSize: 10,
        isActivate: 1,
      },
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 车辆配置表格数据
      configList: [],
      // 弹出层标题
      title: "",
      groups: [],
      // 组织名称
      deptName: undefined,
      // 所有树选项
      deptOptions: undefined,
      deptOptionsShow: undefined,
      codeOptions: [],
      groupOptions: undefined,
      devicesOptions: [],
      simOptions: [],
      // 过滤掉已禁用组织树选项
      enabledDeptOptions: undefined,
      // 是否显示弹出层
      open: false,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        code: null,
        deviceNumber: null,
        simNumber: null,
        deptId: null,
      },
      // 表单参数
      form: {
        groupIds: [],
      },
      props: {
        id: "id",
        label: "name",
        children: "zones",
        isLeaf: "leaf",
      },
      defaultProps: {
        children: "children",
        label: "label",
      },
      groupValue: "",
      splicName: "请选择",
      // 表单校验
      rules: {
        code: [
          { required: true, message: "环保编号不能为空", trigger: "blur" },
        ],
        groupIds: [
          { required: true, message: "车辆分组ID不能为空", trigger: "blur" },
        ],
        deptId: [
          { required: true, message: "所属组织ID不能为空", trigger: "blur" },
        ],
        devicesId: [
          { required: true, message: "终端编号不能为空", trigger: "blur" },
        ],
        simId: [
          { required: true, message: "SIM卡号不能为空", trigger: "blur" },
        ],
      },
    };
  },
  watch: {
    // 根据名称筛选组织树
    deptName(val) {
      this.$refs.tree.filter(val);
    },
  },
  created() {
    this.getList();
    this.getDeptTree();
    this.handleLoadMore();
    this.handleDevicesLoadMore();
    this.handleSimLoadMore();
    this.getDeptTreeThree();
  },
  methods: {
    keydowm() {
      this.groupValue = "";
      this.fatherName = "";
      this.form.groupNames = [];
      this.form.groupIds = [];
      this.$refs.groupTree.setCheckedKeys([]);
    },
    /** 查询车辆配置列表 */
    getList() {
      this.loading = true;
      listConfig(this.queryParams).then((response) => {
        this.configList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },
    /** 查询组织下拉树结构 */
    getDeptTree() {
      deptTreeSelect().then((response) => {
        this.deptOptions = response.data;
        this.enabledDeptOptions = this.filterDisabledDept(
          JSON.parse(JSON.stringify(response.data))
        );
      });
    },
    getDeptTreeThree() {
      deptTreeSelectThree().then((response) => {
        this.deptOptionsShow = response.data;
      });
    },
    // 过滤禁用的组织
    filterDisabledDept(deptList) {
      return deptList.filter((dept) => {
        if (dept.disabled) {
          return false;
        }
        if (dept.children && dept.children.length) {
          dept.children = this.filterDisabledDept(dept.children);
        }
        return true;
      });
    },
    // 筛选节点
    filterNode(value, data) {
      if (!value) return true;
      return data.label.indexOf(value) !== -1;
    },
    // 节点单击事件
    handleNodeClick(data) {
      this.queryParams.deptId = data.id;
      this.handleQuery();
    },
    codeSelected(item) {
      console.log(item);
      this.form.carId = item.carId;
      console.log(item.code);
      this.form.code = item.code;
    },
    groupIdsSelected(b) {
      console.log(b);
      const item = this.groupOptions.find((option) => option.id === b);
      this.form.groupNames = item.name;
    },
    devicesIdSelected(item) {
      console.log(item);
      this.form.devicesId = item.deviceId;
      this.form.deviceNumber = item.number;
    },
    simIdSelected(item) {
      console.log(item);
      this.form.simId = item.simId;
      this.form.simNumber = item.number;
    },
    handleCodeSearch(query) {
      this.selectObj.code = query;
      this.codeLoading = true;
      this.codeOptions = [];
      this.codeLoading = false;
      this.handleLoadMore();
    },
    handleDevicesSearch(query) {
      this.selectDevicesObj.number = query;
      this.devicesLoading = true;
      this.devicesOptions = [];
      this.devicesLoading = false;
      this.handleDevicesLoadMore();
    },
    handleSimSearch(query) {
      this.selectSimObj.number = query;
      this.simLoading = true;
      this.simOptions = [];
      this.simLoading = false;
      this.handleSimLoadMore();
    },
    /**
     * 下拉加载
     */
    handleLoadMore() {
      let arr = [];
      if (!this.codeLoading) {
        this.selectObj.pageNum++;
        listCarNoUse(this.selectObj).then((res) => {
          arr = res.rows;
          console.log(arr);
          this.codeOptions = this.codeOptions.concat(arr);
          console.log(this.codeOptions);
        });
      }
    },
    handleDevicesLoadMore() {
      let arr = [];
      if (!this.devicesLoading) {
        this.selectDevicesObj.pageNum++;
        listDevice(this.selectDevicesObj).then((res) => {
          arr = res.rows;
          this.devicesOptions = this.devicesOptions.concat(arr);
          console.log(this.devicesOptions);
        });
      }
    },
    handleSimLoadMore() {
      let arr = [];
      if (!this.simLoading) {
        this.selectSimObj.pageNum++;
        listSim(this.selectSimObj).then((res) => {
          arr = res.rows;
          this.simOptions = this.simOptions.concat(arr);
          console.log(this.simOptions);
        });
      }
    },
    loadGroupNode(node, resolve) {
      if (node.level === 0) {
        listGroupByDept().then((response) => {
          resolve(response.data);
        });
      }
      if (node.level > 0) {
        getGroupsByDeptId(node.data.id).then((response) => {
          resolve(response.data);
        });
      }
    },

    handleCheck(node, data) {
      let nodes = this.$refs.groupTree.getCheckedNodes();
      let arr = [];
      this.groupValue = "";
      this.fatherName = "";
      this.form.groupNames = [];
      this.form.groupIds = [];
      nodes.forEach((e) => {
        if (e.leaf) {
          arr.push(e);
        }
      });
      let dataArr = Array.from(new Set(arr));
      dataArr.forEach((e) => {
        if (e.pId != node.pId) {
          this.$refs.groupTree.setChecked(node.id, false, true);
          this.$message.warning("只可选择同一级下的组");
          dataArr = dataArr.filter((item) => item.id != node.id);
          return false;
        }
      });

      this.fatherName = dataArr[0].parentName + "-";
      this.form.groupIds = dataArr.map((item) => item.id);
      this.form.groupNames = dataArr.map((item) => item.name);
      let name = this.form.groupNames.toString();
      this.groupValue = this.fatherName + name;
      this.form.groupNames = this.groupValue;
    },
    optionSelected(d) {
      this.deptName = d.label;
      getGroupsByDeptId(d.id).then((response) => {
        this.groupOptions = response.data;
      });
    },
    optionGroupSelected() {
      if (!this.form.deptId) {
        this.$modal.msgWarning("请选择归属组织/人");
      }
    },
    handleGroupChange(e) {
      console.log(e);
      // this.form.groupIds = e.join(',');
      const gn = [];
      e.forEach((item) => {
        console.log(item);
        this.groupOptions.forEach((option) => {
          console.log(option);
          if (option.groupId == item) {
            gn.push(option.groupName);
          }
        });
      });
      this.form.groupNames = this.deptName + "-" + gn.join(",");
      console.log(this.form.groupIds);
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.form = {
        configId: null,
        carId: null,
        code: null,
        groupIds: [],
        groupNames: [],
        deptId: null,
        devicesId: null,
        deviceNumber: null,
        simId: null,
        simNumber: null,
        isOnline: null,
        onlineTime: null,
        isDisabled: 0,
        disabledTime: null,
        isCancle: 0,
        cancleTime: null,
        isRegister: null,
        registerTime: null,
        isNotice: 0,
        isEmergency: 0,
        delFlag: null,
        createBy: null,
        createTime: null,
        updateBy: null,
        updateTime: null,
      };
      this.resetForm("form");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.configId);
      this.single = selection.length !== 1;
      this.multiple = !selection.length;
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();
      this.title = "添加车辆配置";
      this.open = true;
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset();
      const configId = row.configId || this.ids;
      getConfig(configId).then((response) => {
        this.form = response.data;
        this.groupValue = this.form.groupNames;
        this.form.oldSimNumber = this.form.simNumber;
        this.form.oldDeviceNumber = this.form.deviceNumber;
        getGroupsByDeptId(this.form.deptId).then((response) => {
          this.groupOptions = response.data;
          this.groups = this.form.groupIds.split(",");
          const gs = [];
          this.groups.forEach((item) => {
            gs.push(Number(item))
          })
          this.groups = gs;
          this.title = "修改车辆配置";
          this.open = true;
        });
      });
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          console.log(1111, this.form);
          this.form.groupIds = this.form.groupIds.toString();
          // this.form.groupNames = this.form.groupNames.toString();
          if (this.form.configId != null) {
            updateConfig(this.form).then((response) => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            });
          } else {
            addConfig(this.form).then((response) => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const configIds = row.configId || this.ids;
      this.$modal
        .confirm('是否确认删除车辆配置编号为"' + configIds + '"的数据项？')
        .then(function () {
          return delConfig(configIds);
        })
        .then(() => {
          this.getList();
          this.$modal.msgSuccess("删除成功");
        })
        .catch(() => {});
    },
    /** 导出按钮操作 */
    handleExport() {
      this.download(
        "base/config/export",
        {
          ...this.queryParams,
        },
        `config_${new Date().getTime()}.xlsx`
      );
    },
  },
};
</script>
